// 自定义hook
// 特点: 函数以use开头
// 将公共的js代码抽离达到复用的目的. 和vue 中的组合式函数
import { useState, useEffect } from 'react'
export function useNetwork() {

    // 定义一个变量, 定义初始的网络状态
    const [networkstatus, setNetworkStatus] = useState(navigator.onLine)
    // 希望监听浏览器的在线和离线状态, 进而重新设置 网络状态

    useEffect(() => {
        // online 事件: 当网络状态变成在线触发该事件
        window.addEventListener('online', () => {
            console.log('online');
            setNetworkStatus(true)
        })
        // offline 事件: 当网络状态变成离线的时候触发
        window.addEventListener('offline', () => {
            console.log('offline');
            setNetworkStatus(false)
        })

    }, [])


    return networkstatus

}



// import { useNetwork } from '/'
// useNetwork()